/*
 * @Author: zhang 
 * @Date: 2019-09-20 11:39:35 
 * @Last Modified by: zhang
 * @Last Modified time: 2019-09-21 16:57:23
 */

import React, { Component } from 'react';
import { Card /*, Button */ } from 'antd';
import { connect } from 'dva';

const namespace = 'puzzlecards';

const mapStateToProps = (state) => {
    const cardList = state[namespace].data;
    // console.log('cardList: ', cardList);
    return {
        cardList,
    };
};

const mapDispatchToProps = (dispatch) => {
    return {
        onDidMount: () => {
            dispatch({
                type: `${namespace}/queryInitCards`,
            });
        },
    };
};

@connect(mapStateToProps, mapDispatchToProps)
export default class PuzzleCardsPage extends Component {
    componentDidMount() {
        this.props.onDidMount();
    }

    render() {
        return (
            <div>
            {
                this.props.cardList.map(card => {
                    {/* console.log('card: ', card) */}
                    return (
                        <Card key={card.id}>
                            <div>Q: {card.setup}</div>
                            <div>
                            <strong>A: {card.punchline}</strong>
                            </div>
                        </Card>
                    );
                })
            }
            </div>
        );
    }
}